<template>
	<view style="border:1px solid #F5F5F5">
		<view class="cont">
		    <view class="header">
		      <view>
		        <image v-if="userInfo.avatar" :src="imgpath+userInfo.avatar" @click="openImg" style="width:100rpx;height:100rpx;padding-right:10rpx"></image>
		        <image v-else :src="userlogo" style="width:100rpx;height:100rpx;padding-right:10rpx"></image>
		      </view>
		      <view>{{userInfo.userName}}</view>
		    </view>
		    <!-- <view class="myorder">
		      <view>我的订单</view>
		      <view style="width:100%;margin-top:20rpx">
		        <u-row >
		          <u-col span="3">
		          	<view @click="goOrderPage(0)" style="text-align:center">
		              <image src="../../static/images/mord3.png"></image>
		              <view>全部</view>
		            </view>
		          </u-col>
		          <u-col span="3">
		          	<view @click="goOrderPage(1)" style="text-align:center">
		              <image src="../../static/images/mord1.png"></image>
		              <view>待取</view>
		            </view>
		          </u-col>
		          <u-col span="3">
		          	<view @click="goOrderPage(2)" style="text-align:center">
		              <image src="../../static/images/mord2.png"></image>
		              <view>已完成</view>
		            </view>
		          </u-col>
		          <u-col span="3">
		          	<view @click="goOrderPage(3)" style="text-align:center">
		              <image src="../../static/images/mord4.png"></image>
		              <view>退单</view>
		            </view>
		          </u-col>
		        </u-row>
		      </view>
		    </view> -->
		    <view class="molist">
				<navigator  url="card_manager/card_manager" style="width:100%">
				  <view class="mos">
				    <image :src="mylis3"></image>
				    <view style="width: 90%;">卡片功能</view>
				    <view class="ricon"><u-icon name="arrow-right" /></view>
				  </view>
				</navigator>
				<navigator  url="collection/index" style="width:100%">
				  <view class="mos">
				    <image :src="mylis4"></image>
				    <view style="width: 90%;">菜品收藏</view>
				    <view class="ricon"><u-icon name="arrow-right" /></view>
				  </view>
				</navigator>
		        <navigator  url="baseinfo/index" style="width:100%">
		            <view class="mos">
						<image :src="mylis1"></image>
						<view style="width: 90%;">个人信息</view>
						<view class="ricon" ><u-icon name="arrow-right" size="20" align="right"></u-icon></view>
		            </view>
		        </navigator>
				<navigator  url="order/index" style="width:100%">
				  <view class="mos">
				    <image :src="mord3"></image>
				    <view style="width: 90%;">我的订单</view>
				    <view class="ricon"><u-icon name="arrow-right" /></view>
				  </view>
				</navigator>
		        <navigator  url="pwd/index?formpage=0" style="width:100%">
		          <view class="mos" style="margin-top:10rpx">
		            <image :src="userpwd"></image>
		            <view style="width: 90%;">设置</view>
		            <view class="ricon"><u-icon name="arrow-right" /></view>
		          </view>
		        </navigator>
		       <view style="width:96%;margin:20rpx auto;">
		          <u-button  class="outlogin" type="default" size="large" @click="outlogin">退出登录</u-button>
		        </view>
		    </view>
		</view>
		<u-popup
		  :show="show"
		  mode="center"
		>
		<image :src="imgpath+userInfo.ulogo" ></image>
		</u-popup>
	</view>
</template>

<script>
	import Config from '@/util/index.js'
	import {
	 getUserInfo
	} from '@/api/user'
	export default{
		data(){
			return{
				userId:"",
				 activebar:3,
				show:false,
				imgpath:'',
				userlogo:'',
				mylis3:'',
				mylis4:'',
				mylis1:'',
				mord3:'',
				userpwd:'',
				userInfo:{
				}
			}
		},
		onLoad(options) {
			 this.imgpath = Config.get('apiUrl')
			this.getData()
			this.userlogo = this.picUrl + "userlogo.png"
			this.mylis3 = this.picUrl + "mylis3.png"
			this.mylis4 = this.picUrl + "mylis4.png"
			this.mylis1 = this.picUrl + "mylis1.png"
			this.mord3 = this.picUrl + "mord3.png"
			this.userpwd = this.picUrl + "userpwd.png"
			 // this.userInfo = uni.getStorageSync('loginInfo')
		},
	
		methods:{
			// goOrderPage(activeTab){
			//   uni.setStorageSync('tabActive',activeTab);
			//   uni.navigateTo({
			//     url: 'order/index?active='+activeTab,
			//   })
			// },
			// openImg(){
			//   this.show=true
			// },
			// onClose(){
			//   this.show=false
			// },
			outlogin(){
				uni.clearStorage()
				uni.clearStorageSync()
			  uni.redirectTo({
			    url: '../../login/index',
			  })
			  
			},
			getData(){
				const app = this
				uni.getStorage({
					key: 'userifo',
					success: function (res) {
						let userInfo = JSON.parse(res.data)
						let params = {
							userId:userInfo.userId
						}
						getUserInfo(params).catch(response => {							
							if(response.data.code==200){
								app.userInfo=response.data.data
							}
						})	
					}
				})
			},
		}
	}
</script>

<style scoped>
	.cont{width:100%;height:100%;background-color: #f5f5f5;}
	.header{
	  width:100%;height:150rpx;display: flex;align-items: center;background:#ffffff;padding-left:20rpx
	}
	.myorder image{width:50rpx;height:50rpx}
	.myorder{background-color: #ffffff;margin-top:20rpx;padding:20rpx}
	.molist{margin-top:20rpx;}
	.molist .mos{width:100%;height:110rpx;line-height:110rpx;display:flex;align-items: center;margin-top:5rpx;background-color: #ffffff;padding-left:20rpx}
	.molist .mos image{width:50rpx;height:50rpx;padding-right:10rpx;}
	.molist .mos .ricon{width:10%;text-align: right;}
</style>
